<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
  String path = request.getContextPath();
  String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>添加新联系人</title>
  <style type="text/css">
    .outer-box {

      margin: 0 auto;
      height: 700px;
      width: 50%;
      padding: 100px 150px;
      box-sizing: border-box;
    }
    .header-box{
      border: 1px solid #5c4591;
      background-color: #9a77e8;
      padding: 5px 0;
      text-align: center;
      font-size: 22px;
      color: #fff;
    }
    .form-box{
      border: 1px solid #5c4591;
      height: 100%;
      width: 100%;
      background-color: #eee;
      padding: 80px 0;
      box-sizing: border-box;
    }
    .user_info{
      display: flex;
      margin-bottom: 15px;
    }
    .title{
      color: #4f3291;
      font-weight: bold;
      flex: 1;
      text-align: right;
      margin-right: 8px;
      line-height: 25px;
    }
    .input{
      flex: 2;
    }
    .content{
      outline: none;
      border: none;
      width: 80%;
      height: 25px;
    }
    .buttons{
      padding: 0 60px;
      margin: 0;
      display: flex;
      gap: 10px;
      margin-top: 40px;
    }
    .button{
      flex: 1;
      border: none;
      height: 28px;
      background-color: #9a77e8;
      color: #fff;
    }
  </style>
</head>
<body >
<div class="outer-box">
  <div class="header-box">
   * 添加新联系人 *
  </div>
  <form class="form-box" action="ZhuceServlet"method="post" style="padding-top:-700px;">
    <div class="user_info">
      <div class="title">
        请输入用户名:
      </div>
      <div class="input">
        <input class="content" name="name" type="text">
      </div>
    </div>
    <div class="user_info">
      <div class="title">
        请输入电话:
      </div>
      <div class="input">
        <input class="content" name="number" type="text">
      </div>
    </div>
    <div class="user_info">
      <div class="title">
        请输入地址:
      </div>
      <div class="input">
        <input class="content" name="address" type="text">
      </div>
    </div>
    <div class="buttons">
      <input class="button" type="reset" value="重置">
      <input class="button" type="submit" value="添加">
    </div>

  </form>
</div>

</body>
</html>